<template>
  <view class="page-content flex-col">
    <view class="address-list">
      <block v-if="addressList.length == 0">
        <empty></empty>
      </block>
      <view
        v-else
        class="flex-col list-item"
        v-for="(item, index) in addressList"
        :key="index"
        @click="onSelChange(item)"
      >
        <view class="flex-col">
          <view class="flex-row self-stretch">
            <text class="font text_2">{{ item.address }}</text>
            <text class="ml-6 font">{{ item.houseNumber }}</text>
          </view>
          <image
            class="shrink-0 self-end image_4"
            src="/static/common/edit-icon.png"
            @click="handleEdit(item.id)"
          />
        </view>
        <view class="flex-row mt-1">
          <text class="font_2 text_3">{{ item.contacts }}</text>
          <text class="font_2 ml-9">{{ item.phone }}</text>
        </view>
      </view>
    </view>
    <view class="add-address">
      <view class="submit" @click="handleAdd"> 新增 </view>
    </view>
  </view>
</template>

<script>
import mine from "../../../../api/mine";
import empty from "components/common/empty/empty.vue";
const app = getApp();
export default {
  data() {
    return {
      addressList: [],
      address: null,
      backurl: "",
    };
  },
  onShow() {
    this.getAddressList();
  },
  onLoad(option) {
    let urlname = option.urlname;
    if (urlname != undefined && urlname && urlname != null) {
      this.backurl = urlname;
    }
  },
  methods: {
    onSelChange(event) {
      this.address = event;
      if (this.backurl == "seladdress") {
        app.globalData.orderaddress = this.address;
        uni.navigateBack();
      } else if (this.backurl == "startaddress") {
        app.globalData.startaddress = this.address;
        uni.navigateBack();
      } else if (this.backurl == "endaddress") {
        app.globalData.endaddress = this.address;
        uni.navigateBack();
      }
    },
    handleAdd() {
      uni.navigateTo({
        url: "/page_index/me/components/addAddress/addAddress",
      });
    },
    getAddressList() {
      mine.getAddressList().then((res) => {
        if (res.code == 200) {
          this.addressList = res.rows;
        }
      });
    },
    handleEdit(id) {
      uni.navigateTo({
        url: "/page_index/me/components/addAddress/addAddress?id=" + id,
      });
    },
  },
  components: {
    empty,
  },
};
</script>

<style lang="scss" scoped>
.page-content {
  height: 100%;
  width: 100%;
  background-color: #ffffff;
  padding: 0 32rpx;

  .address-list {
    height: 100%;
    overflow-y: auto;

    .mt-1 {
      margin-top: 2rpx;
    }

    .ml-9 {
      margin-left: 18rpx;
    }

    .list-item {
      padding: 24rpx 0;
      border-bottom: solid 2rpx #f3f3f3;

      .font {
        font-size: 28rpx;
        font-family: PingFang SC;
        line-height: 26.3rpx;
        font-weight: 700;
        color: #000000;
      }

      .text_2 {
        line-height: 26.04rpx;
      }

      .image_4 {
        margin-right: 8rpx;
        border-radius: 4rpx;
        width: 32rpx;
        height: 32rpx;
      }

      .font_2 {
        font-size: 24rpx;
        font-family: PingFang SC;
        line-height: 17.8rpx;
        color: #999999;
      }

      .text_3 {
        line-height: 17.14rpx;
      }
    }
  }

  .add-address {
		padding-bottom: 32rpx;
    .submit {
      height: 88rpx;
      background: #fcd610;
      border-radius: 16rpx 16rpx 16rpx 16rpx;
      font-weight: bold;
      font-size: 28rpx;
      color: #000000;
      text-align: center;
      line-height: 88rpx;
    }
  }
}
</style>
